<template>
	<!-- 报废详情 -->
	<view class="scan-check">
		<view class="scan-head">
			<view class="input-content">
				<uni-list>
					<uni-list-item :title="customFormData.assetName||'--'" :note="customFormData.assetNo" :rightText="customFormData.applyUnitName"  />
					<uni-list-item :title="'资产状态：'+customFormData.assetStatusCh" :rightText="'报废状态：'+customFormData.statusCh"/>
				</uni-list>
			</view>
			
			<view class="form-content">
				<uni-forms ref="customForm" :modelValue="customFormData">
					<uni-forms-item label="原因描述">
						<uni-easyinput type="textarea" v-model="customFormData.remarks" placeholder="" :disabled="true"></uni-easyinput>
					</uni-forms-item>
					<uni-forms-item label="附件">
						<image :src="imgURL+item.enclUrl" v-for="(item,index) in photoList" :key="index" @click="toPre(imgURL+item.enclUrl)"></image>
					</uni-forms-item>
				</uni-forms>
			</view>
			
		</view>
		
		<view class="bottom-btn">
			<button class="end-btn" @click="effectBtn" v-if="customFormData.statusCh=='待处理'"><text class="iconfont icon-baoxiu-xuanzhong"></text>实施</button>
			<button class="end-btn" @click="confirmBtn" v-if="customFormData.statusCh=='处理中'"><text class="iconfont icon-jsontijiao"></text>确认报废</button>
		</view>
		<!-- 提示弹窗 -->
		<!-- <uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog type="warn" cancelText="取消" confirmText="确认" title="提示" :content="flag?'确认该设备已报废吗？':'确认该设备已报废好？'"
				@confirm="dialogConfirm"></uni-popup-dialog>
		</uni-popup> -->
		<MessageTip ref="messageTip" :tipContent="flag?'确认该设备已报废吗？':'确认该设备已报废好？'" @clickType="handleShowOrHideTip"/>
		
		
		<ImgPre :imgUrl="imgUrlPre" ref="openImg" :imgFlag="imgFlag"/>
	</view>
</template>

<script lang="ts" setup>
	import {
		ref,
		
	} from 'vue'
	// import {
	// 	useRoute
	// } from 'vue-router'
	import ImgPre from '@/components/ImgPre.vue'
	import {imgURL} from '@/common/config/config.ts'
	import {
		repairDetail,
		repairExec,
		repairConfirm,
		viewPhoto
	} from '@/common/api/repairEquipment.ts'
	import {onLoad} from '@dcloudio/uni-app'
	const messageTip = ref()
		const handleShowOrHideTip = (type:string)=>{
			if(type=='yes'){
				dialogConfirm()
			}
		}
	/*
	 *
	 * 数据
	 * 
	 */
	let customFormData=ref(<any>{})
	const imgUrlPre=ref('')
	// const route = useRoute()
	let photoList=ref([])
	let alertDialog=ref(null)
	let flag=ref(0)//0实施 1确认完成
	const imgFlag=ref(false)
	let pathParams=ref(<any>{})
	onLoad((params:any)=>{
		pathParams.value=params
		console.log(pathParams.value);
		
		getDetailData()
	})
	/*
	 *
	 * 方法
	 * 
	 */
	const toPre=(url:string)=>{
		imgUrlPre.value=url
		imgFlag.value=!imgFlag.value
	}
	const getDetailData = () => {
		repairDetail(pathParams.value.assetExecDtlId).then((res: any) => {
			if (res.code == 0) {
				customFormData.value = res.data
				getPhoto()
			}
		})
	}
	// getDetailData()
	
	const getPhoto=()=>{
		viewPhoto(customFormData.value?.assetApplyId).then((res:any)=>{
			if(res.code==0){
				photoList.value=res.data
			}
		})
	}
	
	const effectBtn = () => {
		flag.value=0
		// alertDialog.value.open('center')
		messageTip.value.openTip()
	}
	const confirmBtn = () => {
		flag.value=1
		// alertDialog.value.open('center')
		messageTip.value.openTip()
	
	}
	const dialogConfirm=()=>{
		if(flag.value){
			repairConfirm([{...customFormData.value}]).then((res:any)=>{
				if(res.code==0){
					uni.showToast({
						title: res.message,
						icon:'none',
						duration:500
					});
					setTimeout(()=>{
						getDetailData()
					},500)
				}else{
					uni.showToast({
						title: res.message,
						icon:'none'
					});
				}
			})
		}else{
			repairExec({...customFormData.value}).then((res:any)=>{
				if(res.code==0){
					uni.showToast({
						title: res.message,
						icon:'none',
						duration:500
					});
					setTimeout(()=>{
						getDetailData()
					},500)
				}else{
					uni.showToast({
						title: res.message,
						icon:'none'
					});
				}
			})
		}
	}
	// 提交
	// const endCheckBtn = () => {
	// 	uni.navigateTo({
	// 		url: '/pages/checkAssets/checkResult/index',
	// 	})
	// }
	
</script>

<style lang="scss" scoped>
	uni-page-body {
		height: 100%;
	}

	.scan-check {
		width: 100%;
		height: 100%;

		.scan-head {
			height: 400rpx;
			background: url(../../../src/static/img/bg1.png) no-repeat;
			background-size: 100% 100%;
		}

		.end-btn {
			width: 60%;
			line-height: 2;
			background-color: #fd8f1a;
			color: #fff;
			.icon-bianji{
				font-size: 34rpx;
			}
		}

		.input-content {
			background-color: #fff;
			width: 90vw;
			margin-left: 5vw;
			border-radius: 10rpx;
			box-shadow: (0, 0, 0, 0.08) 0px 0px 3px 1px;
			padding: 40rpx 20rpx 40rpx 20rpx;
			box-sizing: border-box;
		}
		.form-content{
			background-color: #fff;
			margin-top: 50rpx;
			padding: 40rpx;
		}
		.detail-btn {
			.end-btn {
				line-height: 2;
				background-color: #fd8f1a;
				color: #fff;
			}
		}
		.iconfont{
			margin-right: 10rpx;
		}
		:deep(uni-image){
			width: 4.625rem !important;
			height: 4.625rem !important;
			margin-right: 5rpx;
		}
		// image{
		// 	width: 180rpx;
		// 	height: 180rpx;
		// }
	}
</style>
